/*
 * @Author       : NaN 353362604@qq.com
 * @Date         : 2023-07-14 09:34:03
 * @LastEditTime : 2023-07-17 17:30:26
 * @LastEditors  : NaN 353362604@qq.com
 * @FilePath     : \AdminStration\src\Pages\Front\Assets\Modal\TableTest.jsx
 * @Description  :
 */
import request from 'umi-request'
import { useEffect, useRef, useState } from 'react'
import { ProTable } from '@ant-design/pro-components'
import { useEventEmitter, useSize } from 'ahooks'
import { ModalBox } from '../../../../Common/Modal/ModalBox'
import { TestTypeMappingTwo } from '../../../../Common/Configure/CommonParameter'

export const TableTest = ({ data }) => {
    const { uuid } = data
    const headers = { Authorization: sessionStorage.getItem('TOKEN') }
    const tableBox = useRef(null)
    const BoxSize = useSize(tableBox)
    const actionRef = useRef()
    const formRef = useRef()
    const OptionsEvent = useEventEmitter()
    const [configure, setConfigure] = useState()
    const [IndexNumber, setIndexNumber] = useState(1)
    const [SizeNumber, setSizeNumber] = useState(10)
    const [OptionsCall, setOptionsCall] = useState()

    const [LeftData, setLeftData] = useState()
    const [RightTip, setRightTip] = useState()

    useEffect(() => {
        const { LabList, result } = data
        const leftData = LabList.map(({ type, qualifiedCount, nonQualifiedCount }) => ({
            label: type,
            value: result === 1 ? nonQualifiedCount : qualifiedCount,
        }))
        setLeftData(leftData)
        setRightTip(leftData[0].label)
    }, [data])

    useEffect(() => {
        const { result, startDate } = data
        const getList = async type => {
            const page = await import(`./List`).catch(() => false)
            const table = await page[type]({ uuid, OptionsEvent, result, startDate })
            setSizeNumber(table.pageSize)
            setConfigure(table)
        }
        if (RightTip) getList(TestTypeMappingTwo[RightTip])
    }, [RightTip, OptionsEvent, uuid, data])
    OptionsEvent.useSubscription(val => setOptionsCall(val))
    return (
        <div className="FrontTableTest" ref={tableBox}>
            {LeftData && (
                <div className="Box">
                    <div className="Lef">
                        {LeftData.map(({ label, value }) => (
                            <div
                                key={label}
                                className={label === RightTip ? 'active' : ''}
                                onClick={() => setRightTip(label)}
                            >
                                <div>{label}</div>
                                <div>{value}</div>
                            </div>
                        ))}
                    </div>
                    <div className="Rig" ref={tableBox}>
                        {configure && BoxSize && (
                            <ProTable
                                actionRef={actionRef}
                                formRef={formRef}
                                rowKey="uuid"
                                columns={configure.columns}
                                cardBordered
                                params={configure.params}
                                request={async (params = {}) => {
                                    delete params.current
                                    params.pageIndex = IndexNumber ?? 1
                                    if (params.IsCheckbox) {
                                        let data = {}
                                        params.IsCheckbox.forEach(item => (data = { ...data, [item]: true }))
                                        delete params.IsCheckbox
                                        params = { ...params, ...data }
                                    }
                                    if (params.SearchSort) {
                                        const { SearchSort } = params
                                        SearchSort.forEach((item, index) => {
                                            const [field, sort] = item.split('-')
                                            params[field] = `${sort}@${index}`
                                        })
                                        delete params.SearchSort
                                    }
                                    return request(configure.get, { params, headers }).then(data => {
                                        if (data.list) return { data: data.list, total: data.total, success: true }
                                        else return { data, success: true }
                                    })
                                }}
                                search={true}
                                pagination={{
                                    pageSize: SizeNumber,
                                    showSizeChanger: true,
                                    onChange: (e, a) => {
                                        setIndexNumber(e)
                                        setSizeNumber(a)
                                    },
                                }}
                                scroll={(() => {
                                    let { width: x, height } = BoxSize
                                    const { hideInSearch } = configure
                                    let y = hideInSearch === undefined ? height - 265 : height - 170
                                    return { x, y }
                                })()}
                            />
                        )}
                    </div>
                </div>
            )}
            <ModalBox OptionsCall={OptionsCall} />
        </div>
    )
}
